export default function ProductDetail({
    params,
  }: {
    params: { productId: string };
  }) {
    return  <main>
    <ul className="list-group">
      <li className="list-group-item active" aria-current="true">
        Afflites
      </li>
    </ul>
   

<table className="table  table-bordered">
<thead className="thead-light">
  
</thead>
<tbody>
  <tr>
    
    <td colSpan={4}> <ul>
      <li>A Lesson On Job Advancement</li>
      <li>Victoria Island Quest</li>
      </ul> </td>
    
  </tr>
  <tr>
   
    <td colSpan={4}>Item(s) Needed:</td>
   
  </tr>
  <tr>
   
    <td colSpan={2}></td>
    
    <td colSpan={2}>None</td>
    
  </tr>
  <tr>
   
    <td colSpan={4}>Jacob</td>
   
  </tr>
  <tr>
   
    <td colSpan={4}>Procedures:

    <ul>
      <li>Talk to Olaf in Lith Harbor.</li>
      <li>Correctly answer the questions asked by him.</li>
      <li>The level required to advance as a warrior, thief or bowman.</li>
      
    </ul>



</td>
   
  </tr>
  <tr>
    
    <td colSpan={4}> <ul>
      <li>Reward(s):</li>
      <li>65 experience</li>
      </ul> </td>
    
  </tr>

  
</tbody>
</table>
  </main>;
  }
  